<template>
  <magic-page-designer
    :mpdPageConfig.sync="mpdPageConfig"
    :mpdPageValue.sync="mpdPageValue"
    :selectPageNodeDom.sync="selectPageNodeDom"
    :editorMode="editorMode"
    @mpdSave="mpdSave"
  ></magic-page-designer>
</template>

<script>
export default {
  data() {
    return {
      // 需要渲染的页面json数据，必填
      mpdPageConfig: {},
      // 当前页面所存储的值
      mpdPageValue: {},
      // 编辑模式下选中的dom，非必填
      selectPageNodeDom: {},
      // 是否编辑模式，默认false
      editorMode: true
    }
  },
  methods: {
    // 保存事件
    mpdSave(mpdPageConfigVal) {
      console.log('mpdSave', mpdPageConfigVal)
    }
  }
}
</script>

<style>
html,
body,
#app {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}
</style>
